<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		#div1 {width: 100px; height: 100px; padding: 10px; margin: 20px ; border: 1px solid #000 ; background-color: #45dfff; display: none;}
	</style>
	<script src="../jquery-1.10.1.min.js"></script>
	<script type="text/javascript">
	/*
		$()下的常用方法:
			outerWidth(): 可以获取到隐藏元素的属性值，同理还有innerWidth

			对比js中的offsetWidth: 无法获取隐藏元素的宽/高
	*/
	$(function() {
		// alert( $('#div1').get(0).offsetWidth );			//0

		// alert( $('#div1').width() )						//100. width

		// alert( $('#div1').innerWidth() );				//120. width + paading

		// alert( $('#div1').outerWidth() );				//122. width + paading + border

		alert( $('#div1').outerWidth(true) );				//162. width + paading + border + margin

	});
	</script>
</head>
<body>
	<div id="div1">div</div>
</body>
</html>